<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <style>
        .contact_box {
            width: 1000px;
            margin: 10px auto;
        }
    </style>
</head>
<body>
<div class="contact_box">
    <h1>所有联系人</h1>
    <table class="table-bordered container">
        <thead align="center">
        <tr style="background-color: #00e359">
            <td>头像</td>
            <td>用户名</td>
            <td>唯一标识</td>
        </tr>
        </thead>
        <tbody align="center">
        {% for item in data_list %}
            <tr>
                <td>
                    <img src="/get_img?prev={{ item.HeadImgUrl }}" width="50px" height="50px;" alt="">
                </td>
                <td>{{ item.NickName }} </td>
                <td>{{ item.UserName }} </td>
            </tr>
        {% endfor %}
        </tbody>
    </table>
    <ul class="pagination">
        {% if page_obj.num_pages > 1 %}
            {{ page_str }}
        {% else %}
        {% endif %}
    </ul>
</div>
</body>
</html>